<template>
  <div>
    <Header :title="title"></Header>
		<div v-if="invite.finished && invite.items.length == 0" v-cloak>
		    <div class="no-data aui-text-center aui-text-9">
		        <i class="iconfont icon-lujing1161"></i>
		        <div class="aui-ftn16">
		            空空如也~
		        </div>
		    </div>
		</div>
		<div class="record aui-bg-f">
			<van-pull-refresh v-model="invite.refreshing" @refresh="fnLoadMore" :disabled="disabled">
			    <van-list
			      v-model="invite.loading"
			      :finished="invite.finished"
			      :finished-text="text"
			      @load="fnGetInviteData"
			    >
			        <van-row class="list aui-text-7 aui-ftn14 van-hairline--bottom" v-for="(item, index) in invite.items" :key="index">
			            <van-col span="10" class="aui-text-3" v-text="item.username">
			            </van-col>
			            <van-col span="8" v-text="item.type">
			            </van-col>
			            <van-col span="6" class="aui-ftn12 aui-text-center" v-text="item.createtime">
			            </van-col>
			        </van-row>
			    </van-list>
			</van-pull-refresh>
		</div>
  </div>
</template>

<script>
  import Invite from '../../service/invite.js'
  import Header from '../components/header.vue'
  export default {
    data () {
      return {
        title: '邀请记录',
		loading: false,
        invite: {
            loading: true,
            finished: false,
            refreshing: false,
            items: [],
            p: 0,
            n: 20
        },
		text: '',
		disabled: false
      }
    },
    components: {
      Header
    },
	mounted() {
		this.fnGetInviteData()
		window.addEventListener('scroll', this.handleScroll, true)
	},
	beforeDestroy() {
		window.removeEventListener('scroll', this.handleScroll, true)
	},
    methods: {
		handleScroll() {
			this.disabled = this.utils.handleScroll();
		},
      // 获取数据
      fnGetInviteData: function() {
		  if (this.invite.loading && !this.invite.finished && !this.loading) {
		  	this.loading = true
		  	this.invite.p++
		  	Invite.fnGetInviteRecord({uid: this.$store.state.uid, p: this.invite.p, n: this.invite.n, isToken: true, isLoading: true}).then(res => {
		  		this.loading = false
		  		// 加载状态结束
		  		this.invite.loading = false;
		  		if (res && res.status) {
		  			this.invite.items = this.invite.items.concat(res.data)
		  		} else {
		  			this.invite.finished = true;
		  			if (this.invite.items.length > 0) this.text = '没有更多了'
		  		}
		  	})
		  }
      },
	  fnLoadMore: function() {
	    this.invite.finished = false
	    this.invite.loading = true
		this.invite.refreshing = false;
	    this.invite.p = 0
		this.text = ''
		// 清空列表数据
		this.invite.items = [];
	    this.fnGetInviteData()
	  }
    }
  }
</script>

<style scoped>
  div.record div.list {
      height: 45px;
      line-height: 45px;
      padding-left: 20px;
  }
</style>
